<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>实体卡激活</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1" />
    <link rel="stylesheet" href="{{ url('/common/mobile-common/common.css') }}">
    <link rel="stylesheet" href="{{ url('/mobile/css/header.css') }}">
    <link rel="stylesheet" href="{{ url('/mobile/css/card/index.css') }}">
    <script src="{{ url('mobile/js/jquery-1.8.3.min.js') }}"></script>
    <script src="{{ url('/common/mobile-common/hmt.js') }}"></script>
</head>
<body>
<div class="abouts">
    <div class="wrap-cont clearfix">
        <!--end-->
        <form method="post" action="{{url("wap/card/result")}}">
        <div class="wrap-cont wrap-cont2">
            <p class="tit-ts">请输入旅游卡的卡号及密码，完成激活。</p>
            <div class="km kms">
                <label>卡号:</label>
                <p><input type="text" name="cardNum[]" class="card-num" value="请输入卡号" onfocus="{value=''}"></p>
                <label>密码:</label>
                <p class="mmtxt"><input type="text" name="password[]" class="mm-num" value="请输入密码" onfocus="{value=''}"></p>
                <a><img src="{{ url('mobile/images/sc-icon2.png') }}"></a>
            </div>
        </div>
        <div class="dv-add">
            <a><img src="{{ url('mobile/images/add-img.png') }}"></a>
        </div>
        <div class="jh-btn">
            <button class="a-btn" type="submit">激活</button>
        </div>
        </form>
    </div>
</div>


</body>
<script>
    $(function(){
        var kmLen=$(".kms").length;
        //添加
        $(".dv-add a img").on("touchstart",function(){
            var cardIndex=$(".wrap-cont2 .km.kms").length;
            if(cardIndex>=5){
                alert("最多只能激活5张卡哦！");
            }
            else{
                kmLen++;
                addCard($(".wrap-cont2"));
                $(".kms p input").focus(function(){
                    $(this).val('');
                });
            }


        });
        $(".jh-btn .a-btn").on("touchstart",function(){
            yzFun();
        });
        $(".kms a").unbind().on("touchstart",function(){
            --kmLen;
            removCard($(this));
        });

        //删除
        function removCard(i){
            var comTxt=confirm("是否删除此卡信息？");
            if(comTxt){
                i.parent().remove();
            }
            return false;
        }
        function addCard(e){
            var carInfo='';
            carInfo+='<div class="km kms"><label>卡号:</label>';
            carInfo+='<p><input type="text" name="cardNum[]" class="card-num" value="请输入卡号"></p>';
            carInfo+='<label>密码:</label>';
            carInfo+='<p class="mmtxt"><input type="text" name="password[]" class="mm-num" value="请输入密码"></p>';
            carInfo+='<a><img src="{{ url('mobile/images/sc-icon2.png') }}"></a>';
            carInfo+='</div>';
            $(e).append(carInfo);
            $(".kms a").unbind().on("touchstart",function(){
                --kmLen;
                removCard($(this));
            });
        };
        //验证
        function yzFun(){
            var telNum=$(".tel-num");
            var yzNum=$(".yz-num");
            var myreg = /^1[34578]\d{9}$/;
            var carDv=$(".km.kms");
            var index=0;
            carDv.each(function(){
                ++index;
                if($(this).find(".card-num").val()=='' || $(this).find(".card-num").val()=='请输入卡号'){
                    alert("卡号不能为空");
                    $(this).find(".card-num").focus();
                    return false;
                }
                else if($(this).find(".mm-num").val()==''||$(this).find(".mm-num").val()=='请输入密码'){
                    alert("请输入密码");
                    $(this).find(".mm-num").focus();
                    return false;
                }
            });

        };
    })
</script>
</html>
